<template>
  <div class="container">
    <div class="row">
        <ForumHeader/>
        <div style="margin: 80px;"></div>
        <el-form :label-position="labelPosition" label-width="80px" :model="formLabelAlign" class="col-md-6 mx-auto">
        <el-form-item label="帖子名">
            <el-input v-model="formLabelAlign.articlename"  maxlength="10" show-word-limit></el-input>
        </el-form-item>
        <el-form-item label="帖子内容">
            <el-input
            type="textarea"
            :rows="2"
            placeholder="请输入内容"
            maxlength="30"
            show-word-limit
            v-model="formLabelAlign.articlecontent">
            </el-input>
        </el-form-item>
        <div class="block">
        <span class="demonstration">发帖时间:  </span>
        <el-date-picker
        v-model="formLabelAlign.articletime"
        type="datetime"
        placeholder="选择日期时间">
        </el-date-picker>
        </div>
        </el-form>
        <div style="margin: 30px;"></div>
        <div class="row">
            <el-button type="primary" @click="submitForm()" class="col-md-1 mx-auto" style="margin: 0 auto;">确 定</el-button>
        </div>
    </div>
  </div>
</template>

<script>
import ForumHeader from './ForumHeader.vue';
export default {
    name:"ForumEdit",
    components:{ForumHeader},
    data() {
        return {
            labelPosition: 'top',
            formLabelAlign: {
            articleuser: sessionStorage.username,    
            articlename: '',
            articlecontent: '',
            articletime: " "
            }
        }
    },
    methods:{
        submitForm(){
            this.axios.post('http://localhost:8001/article/savearticle/',this.formLabelAlign).then((resp)=>{
                let data = resp.data;
                if (data.success){
                    this.homeworkform = {};
                    this.$message({
                        message:"操作成功",
                        type:'success'
                    });
                    console.log(this.formLabelAlign)
                }
            })
        },
    },
}
</script>

<style scoped>
</style>